WS-2995 - Support variants needed for search experiment - #14263
Conversation
…of ssh://github.com/bbc/simorgh into WS-2995-support-variants-needed-for-search-experiment
| </div> | ||
| ); | ||
|
|
||
| case 'topicDiscovery': |
There was a problem hiding this comment.
The footer versions use the existing checks for whether Topic Discovery and Location OJ (like showTopicDiscovery and showCountryCuration) are enabled, but the mid-article versions bypass those checks I think. This might display a component that is disabled for a service, or leave the mid-article position empty when it is unavailable. If the response is empty it might handle gracefully but thought it might be worth mentioning
There was a problem hiding this comment.
The country curation not being on a service could be a problem here for variant 6. I will ask Gavin.
There was a problem hiding this comment.
Answer is to fallback to most read in the mid-article spot (same as control) when the variant defined component is unavailable. This will happen with Location OJ and Related Content.
There was a problem hiding this comment.
I take it Topic Discovery is guaranteed to be available for every article in scope, as this mid-article path does not use showTopicDiscovery? If it is guaranteed then this should be fine otherwise it may need the same fallback so was jw
There was a problem hiding this comment.
I have not encountered any articles where it isn't present, however that's not to say that it couldn't happen? The drawback to having the same fallback is the ordering of that particular variant as you would then have mostRead content showing in the Recommendations component in the mid-article slot and then directly followed by mostRead as the first OJ underneath. I can query that tomorrow with product.
There was a problem hiding this comment.
I think topic discovery is on every service. Let's try not to let it be toggled off for the duration of the experiment! (not sure why it would be. Getting the dedupe fix in as well!)
| export type OJComponentKey = | ||
| | 'mostRead' | ||
| | 'topicDiscovery' | ||
| | 'pvCarousel' |
There was a problem hiding this comment.
Do we also need to have the video curation show if it is there and the portrait video curation is not? The brief indicates we might need to. Chinese and Vietnamese have the simple-curation-grid video curation instead of the PV carousel. The rest show the PV carousel.
There was a problem hiding this comment.
Yes, thanks for highlighting! Pedram has also mentioned this above, I will push an update.
There was a problem hiding this comment.
@LilyL0u I believe I've covered this now. I've combined both as videoOJ rather than two separate things, but if you think that's wrong I can change it. I've checked all the variants locally on portuguese for the pvCarousel, and zhongwen & vietnamese for video curations and all display in the order expect. Let me know what you think!
There was a problem hiding this comment.
yeah I think this is a good way to do it
| }); | ||
| }); | ||
|
|
||
| describe('Mobile behavior with different variants', () => { |
There was a problem hiding this comment.
Not a blocker but think these tests confirm that the hook returns the configured array, but they do not confirm that ArticlePage renders the components in that order. For example, they do not catch Video Curation remaining outside the ordered list. I know we are light touch with experiment tests but we could add a rendered mobile variant test covering the complete order and missing components as it would prob be useful since there's many variants in this experiment
…of ssh://github.com/bbc/simorgh into WS-2995-support-variants-needed-for-search-experiment
…of ssh://github.com/bbc/simorgh into WS-2995-support-variants-needed-for-search-experiment
5 participants
Resolves JIRA: WS-2995
Summary
Supports a group of variants to allow us to run an experiment where we will reorder onward journeys on Article pages for mobile users coming from Search, to validate whether there is an order most popular amongst these visitors.
Code changes
searchReferrerComponentOrder.tswith types for the OJ components we are using, the variant OJ orders, and the mid-article OJ for each variant.useMobileOJComponentOrder.tswith code to allow us to use a param ofdebugVariantin our local url to test component reordering for each variant. Also adds code to detect whether a user is on a mobile viewport so that the reordered components will only show to those users. Desktop users will get the current experience.variant_5_recommended_mid, RelatedTopics will not show.!isMobileOJOrderguard to components that can be repositioned to prevent duplicate rendering.mobileOJContainerstyle withdisplay: 'none'at desktop.marginBottomof40pxto certain variants when in the mid-article OJ slot.Testing
Run a server using
yarn devand visit any article page on the following services:Arabic, Indonesian, Mundo, Portuguese, Russian, Serbian, Turkce, Ukrainian, Urdu, Vietnamese, Zhongwen.Use the debug URL param with the variant of choice to see the components reordered. e.g - http://localhost:7081/mundo/articles/c24m9g9j69ro?renderer_env=live&debugVariant=variant_1_related will show components reordered for
variant_1_related. Orders should show as below:Note: pvCarousel is not available on all services listed above. LocationBasedOJs is also only available for limited services and will require an x-country header and country code value for the component to show. e.g for Mundo
x-country: esfor a Spain topic,x-country: mxfor Mexico.variant_1_related: mostRead (in mid-article position) --> topicDiscovery --> relatedContent --> topStories --> featuredArticles --> mostRead.
variant_2_recommended: mostRead (in mid-article position) --> topicDiscovery --> mostRead --> relatedContent --> featuredArticles --> pvCarousel --> mostRead.
variant_3_hybrid: mostRead (in mid-article position) --> topicDiscovery --> locationBasedOJ --> relatedContent --> mostRead --> pvCarousel --> featuredArticles.
variant_4_related_mid: relatedContent (in mid-article position) --> topicDiscovery --> locationBasedOJ --> topStories --> featuredArticles --> pvCarousel --> mostRead.
variant_5_recommended_mid: topicDiscovery (in mid-article position) --> mostRead --> relatedContent --> featuredArticles --> pvCarousel --> topStories --> locationBasedOJ.
variant_6_hybrid_mid: locationBasedOJ (in mid-article position) --> topicDiscovery --> relatedContent --> mostRead --> pvCarousel --> topStories --> featuredArticles.